<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    <input type="text" id="txt1">
    <select id="computed">
        <option value="+"> + </option>
        <option value="-"> - </option>
        <option value="*"> * </option>
        <option value="/"> / </option>
        <option value="%"> % </option>
    </select>
    <input type="text" id="txt2">
    <input type="button" value="=" id="action">
    <input type="text" id="result" readonly>
</body>
<script>
    
    // 简易计算器
    // 选择器
    var txt1 = document.getElementById("txt1");
    var txt2 = document.getElementById("txt2");
    var computed = document.getElementById("computed");
    var action = document.getElementById("action");
    var result = document.getElementById("result");

    action.onclick = function(){
        var n1 = txt1.value/1;
        var n2 = txt2.value*1;
        var c = computed.value;

        // 执行封装后的计算功能，传入数字和符号
        fn(n1, n2, c);
    }



    function fn(c, b, a){
        var sum = 0;
        switch(a){
            case "+": sum = c + b;break;
            case "-": sum = c - b;break;
            case "*": sum = c * b;break;
            case "/": sum = c / b;break;
            case "%": sum = c % b;break;
        }
        result.value = sum;
    }



</script>
</html>